/**
 * 全单备注模态
 */
;(function ($) {
	//全单备注模态入口
	$.fn.orderRemark=function(options){
    	//创建对象
		var app = new remark(this, options);
		app.html(); 
	}
	
	//构造函数
    var remark = function(ele, opt) {   	
    	//选择器对象    	
        this.$element=ele;   
        //默认参数
        this.defaults = {
        	title:"",//标题
        	list:"",//全单备注
        	relist : "",
    		returnBack:function(){},//返回回调函数
    		dataBack:function(){},//完成取消预授权回调函数
        },        
        //初始化参数
        this.options = $.extend({}, this.defaults, opt);
    }
    
    //属性方法
    remark.prototype = {
    	//构造html
    	html:function(){
    		var $t=this;
    		var $opt=$t.options;
    		var param = $opt;
    		var el = this.$element;
    		
    		$t.$element.addClass("modal").attr("tabindex","-2").attr("data-backdrop","static")
	    		html='<div class="modal-dialog remark_order" style="width:800px;">'+
	    		
						'<div id="modalHtml" class="modal-content" style="width:800px;">'+     
				  			'<div class="modal-header no-padding">'+
								'<div class="table-header widget-header-large " style="text-align:center; font-size:20px">'+  
									'<span>'+ $.i18n.propJsp($opt.title) +'</span>'+       
								'</div>'+
							'</div>'+
							'<div class="modal-body" style="overflow-y:hide;">'+
								'<div class="input-group modal-remark">'+
									'<span class="input-group-addon">'+
										$.i18n.propJsp("菜品：")+
									'</span>'+
									'<textarea class="form-control search-query" placeholder="" name="disrate" id="remarkDishes" style="background:white;" readonly></textarea>'+
									'<span class="input-group-btn">'+
										'<button type="button" class="btn btn-primary btn-sm" id="selDishes">'+
											'<span class="ace-icon fa fa-list icon-on-right bigger-110"></span>'+
										'</button>'+
									'</span>'+
								'</div>'+
								'<div class="input-group modal-remark" id="score_card">'+
									'<span class="input-group-addon">'+
										$.i18n.propJsp("备注：")+
									'</span>'+
									'<textarea class="form-control search-query" placeholder="" name="disrate" id="remark"></textarea>'+
//									'<span class="input-group-btn">'+
//										'<button type="button" class="btn btn-primary btn-sm" id="remark_btn">'+
//											'<span class="ace-icon fa fa-pencil-square-o icon-on-right bigger-110"></span>'+
//										'</button>'+
//									'</span>'+
//									'<textarea class="col-xs-8 search-query" placeholder="" name="disrate" id="remark" style="height:130px;"></textarea>'+
									'<span class="input-group-btn" style="display:flex;flex-direction:column;">'+
										'<button type="button" class="btn btn-primary btn-sm" id="remark_btn">'+
											'<span class="ace-icon fa fa-pencil-square-o icon-on-right bigger-110"></span>'+
										'</button>'+
										'<button type="button" class="btn btn-primary btn-sm" id="singleDel" style="margin-top:5px;">'+
											$.i18n.propJsp("退格")+
										'</button>'+
										'<button type="button" class="btn btn-primary btn-sm" id="clearAll" style="margin-top:5px;">'+
											$.i18n.propJsp("清空")+
										'</button>'+
									'</span>'+
								'</div>'+
							'</div>'+	
							'<div class="modal-body modal-list" style="max-height:200px;">'+  
//								'<div id="remarkList" class="orderTaste"></div>'+
								
								'<div class="col-sm-12 no-padding" style="display:flex;">'+
									'<div id="bigTypeInfo" style="width:105px;display:flex;flex-direction:column;border-right:1px solid #cccccc;padding:3px;">'+
										
									'</div>'+
									'<div id="remarkList" style="flex:1;padding:3px;height:200px;overflow-y: auto;">'+
									
									'</div>'+
								'</div>'+
								
							'</div>'+	
							'<div class="modal-footer">'+
								'<button id="btnSure" class="btn btn-info btn-lg btn-round">'+  
									'<i class="ace-icon fa fa-check"></i>'+$.i18n.propJsp("确定")+
								'</button>'+
								'<button id="btnCancel" class="btn btn-default btn-lg btn-round" data-dismiss="modal">'+  
									'<i class="ace-icon fa fa-undo"></i>'+$.i18n.propJsp("返回")+'</button>'+ 
								'</button>'+
							'</div>'+
		  				'</div>'+
		  				
		  				'<div id="dishesHtml" class="modal-content" style="width:800px;display:none;">'+   
							'<div class="modal-header no-padding">'+
								'<div class="table-header widget-header-large " style="text-align:center; font-size:20px">'+  
									'<span>'+$.i18n.propJsp("选择菜品")+'</span>'+       
								'</div>'+
							'</div>'+
							'<div class="modal-body" style="max-height:400px;overflow-y:auto;overflow-x:hide;">'+  
								'<div id="dishesList" class="orderTaste"></div>'+
							'</div>'+	
							'<div class="modal-footer">'+
								'<button id="btnSelDisdes" class="btn btn-info btn-lg btn-round">'+  
									'<i class="ace-icon fa fa-check"></i>'+$.i18n.propJsp("选择")+
								'</button>'+
								'<button id="btnback" class="btn btn-default btn-lg btn-round">'+  
									'<i class="ace-icon fa fa-undo"></i>'+$.i18n.propJsp("返回")+'</button>'+ 
								'</button>'+
							'</div>'+	
						'</div>'+
					
		  			'</div>'+		
				'</div>'+
			'</div>';
    		
    		$t.$element.html(html);
    		$t.$element.find(".remark_order,.modal-content").css("min-height",0);
    		$t.$element.find(".modal-list").css({"min-height":0});
    		$t.$element.find("#remark").val(param.tsyq);
    		param.tsyqArr = param.tsyq.split(",");
    		
//    		if(!!$opt.list[0].tsyq){
//    			$t.$element.find("#remark").val($opt.list[0].tsyq);
//    		}
    		
    		
//    		全单备注
//    		$("").posorderOrderRemark({
//    			arg:"全单",
//    			getDefaultBack:function(data){
//    				$t.remarkData(data);
//    				$t.bindEvent();
//    			}
//    		});
    		
    		$t.getOrderRemarkBigType(function(){
    			
    			var bigTypeHtml = ''
				$(param.bigType).each(function(k,v){
					var primary = "";
					if(k==0){
						primary = "btn-primary";
					}
					bigTypeHtml += 	'<div class="btn-group">'+
										'<button class="btn btn-sm bigtype '+primary+'" data-type="'+v.mc+'" style="margin:1px;width:97px;height:38px;">'+
											v.mc+
										'</button>'+
									'</div>';
				})
				el.find("#bigTypeInfo").html(bigTypeHtml);
				
				//绑定大类事件
				el.find(".bigtype").unbind("click").click(function(){
					el.find(".bigtype.btn-primary").removeClass("btn-primary");
					$(this).addClass("btn-primary");
					param.type = $(this).data("type");
					$t.initOrderRemark();
				});
				el.find(".bigtype.btn-primary").trigger("click");
    		});
    		
    		var listStr = JSON.stringify($opt.list)
    		$opt.relist = $.parseJSON(listStr);
    		$t.initDishesRemark();
    		$t.initDishesList();
    		$t.bindEvent();
    	},
    	
    	//备注赋值
    	remarkData:function(data){
    		var $t=this;
    		var $opt=$t.options;
    		if(data.length > 0){
    			if(Math.ceil(data.length / 4) > 5){
    				$t.$element.find("#remarkList").css({"width":704});
    			}else{
    				$t.$element.find("#remarkList").css({"width":764});
    			}
//    			if(!!$opt.list[0].tsyq){
//					var arr = $opt.list[0].tsyq.split(",");
//				}
				$(data).each(function(key,value){
					var btn_class = "btn-light";
//					if(!!arr){
//						$(arr).each(function(i,item){
//							if(item == value.mc){
//								btn_class = "btn-primary";
//							}
//						});
//					}
					var btn_html = $('<button type="button" class="btn btn-app '+ btn_class +'">'+ value.mc +'</button>');
    				if(value.mc.length > Math.floor((($t.$element.find("#remarkList").width() - 18) / 4) / 18)){
    					btn_html.css("font-size",(($t.$element.find("#remarkList").width() - 18) / 4) / value.mc.length);
        			}
    				$t.$element.find("#remarkList").append(btn_html);
	    		});
				$t.$element.find("#remarkList button").css({"width":(($t.$element.find("#remarkList").width() - 18 ) / 4 - 7),"height":44.3});
    		}
    	},
    	getOrderRemarkBigType : function(back){
    		var t=this;
    		var param=t.options;
    		var el=t.$element;
    		var arg = {"arg":{"arg":"全单类别"}}
    		$.ajax({
    			url: $.HSAPI_AJAXURL+"/qms/mobile/procedure2",
    			type: "post",
    			dataType: "json",
    			data: $.HSAPI_ASKJSONINFO(JSON.stringify(arg),'POSMenuMessage',JSON.stringify({}),"list"),
    			success : function(data){
    				param.bigType = data;
    				t.getOrderRemarkType(back);
    			},
    			error : function(data){
    				jf_alert(JSON.stringify(data))
    			}
    		})
    	},
    	getOrderRemarkType : function(back){
    		var t=this;
    		var param=t.options;
    		var el=t.$element;
    		var arg = {"arg":{"arg":"全单"}}
    		$.ajax({
    			url: $.HSAPI_AJAXURL+"/qms/mobile/procedure2",
    			type: "post",
    			dataType: "json",
    			data: $.HSAPI_ASKJSONINFO(JSON.stringify(arg),'POSMenuMessage',JSON.stringify({}),"list"),
    			success : function(data){
    				param.remarkType = data;
    				back();
    			},
    			error : function(data){
    				jf_alert(JSON.stringify(data))
    			}
    		});
    	},
    	initOrderRemark : function(){
    		var t=this;
    		var param=t.options;
    		var el=t.$element;
    		
    		var filter = "select * from json where (type=='"+param.type+"')";
    		var data = jsonsql.query(filter,param.remarkType);
    		
    		var smallHtml = "";
    		$(data).each(function(k,v){
				var text = el.find("#remark").val()
				var primary = "";
//				$.inArray(v.mc,param.tsyqArr)
				if(text.indexOf(v.mc)>-1){
					primary = "btn-primary";
				}
				smallHtml +='<div class="btn-group">'+
								'<button data-mc="'+v.mc+'" class="btn btn-sm detailInfo '+primary+'" style="margin:1px;width:104px;height:38px;padding:4px 2px;font-size:12px;">'+
									'<span class="hide">'+JSON.stringify(v)+'</span>'+
									v.mc+
								'</button>'+
							'</div>';
			})
			el.find("#remarkList").html(smallHtml);
			
			el.find(".detailInfo").unbind("click").click(function(){
				var text = el.find("#remark").val();
				var mc = $(this).data("mc");
				if($(this).hasClass("btn-primary")){
					$(this).removeClass("btn-primary");
					text = text.replace((mc+","),"");
					el.find("#remark").val(text);
				}else{
					$(this).addClass("btn-primary");
					text = text + mc + ",";
					el.find("#remark").val(text);
				}
			});
    	},
    	initDishesList : function(){
    		var t=this;
    		var param=t.options;
    		var el=t.$element;
    		
    		var data = param.list
    		var redata = param.relist;
    		if(data.length > 0){
    			if(Math.ceil(data.length / 4) > 5){
    				el.find("#dishesList").css({"width":704});
    			}else{
    				el.find("#dishesList").css({"width":764});
    			}
    			var reStr = JSON.stringify(redata)
				$(data).each(function(key,value){
					var btn_class = "btn-light";
					if(reStr.indexOf(("\""+value.mc+"\""))>-1){
						btn_class = "btn-primary";
					}
					var btn_html = $('<button type="button" class="btn btn-app '+ btn_class +'">'+ 
										'<span class="json hide">'+JSON.stringify(value)+'</span>'+
										value.mc +
									'</button>');
    				if(value.mc.length > Math.floor(((el.find("#dishesList").width() - 18) / 4) / 18)){
    					btn_html.css("font-size",((el.find("#dishesList").width() - 18) / 4) / value.mc.length);
        			}
    				el.find("#dishesList").append(btn_html);
	    		});
				el.find("#dishesList button").css({"width":(el.find("#dishesList").width() - 18) / 4,"height":44.3});
    		}
    	},
    	//绑定事件
    	bindEvent:function(){
    		var $t=this;
    		var $opt=$t.options;
    		var el=$t.$element;
    		
    		//手写
    		el.find("#remark_btn").unbind("click").bind("click",function(){
    			window.location.href = "handwriter://";
    			el.find("#remark").focus();
    		});
    		
    		//退格
    		el.find("#singleDel").unbind("click").bind("click",function(){
    			var searchTableNo = el.find("#remark").val();
				var value = $(this).data("content");
				if(searchTableNo){
					searchTableNo = searchTableNo.substr(0,searchTableNo.length-1);
					el.find("#remark").val(searchTableNo);
				}
    		})
    		
    		//清空
    		el.find("#clearAll").unbind("click").bind("click",function(){
    			el.find("#remark").val("");
    		})
    		
    		//选择备注
    		el.find("#remarkList button").bind("click",function(){
    			var remark = el.find("#remark").val();
    			if($(this).hasClass("btn-primary")){
    				$(this).removeClass("btn-primary").addClass("btn-light");
    				remark = remark.replace(""+ $(this).text() +",","");
    			}else{
    				$(this).removeClass("btn-light").addClass("btn-primary");
					remark = remark + $(this).text() + ",";    						
    			}
    			el.find("#remark").val(remark);
    		});
    		
    		//取消
    		el.find("#btnCancel").bind("click",function(){
    			$opt.returnBack();
    		});
    		
    		//确定
    		el.find("#btnSure").bind("click",function(){
    			var remark = el.find("#remark").val();
    			var data = {relist:$opt.relist,remark:remark};
    			$opt.getDefaultBack(data);
    		});
    		
    		//显示选择菜品
    		el.find("#selDishes").click(function(){
    			el.find("#dishesHtml").show();
    			el.find("#modalHtml").hide();
    		})
    		
    		//选择和返回
    		el.find("#btnSelDisdes,#btnback").click(function(){
    			el.find("#modalHtml").show();
    			el.find("#dishesHtml").hide();
    		})
    		
    		el.find("#dishesList button").click(function(){
    			var json = $.parseJSON($(this).find("span.json").text())
    			if($(this).hasClass("btn-primary")){
    				var index = -1;
    				$($opt.relist).each(function(k,v){
    					if(json.xh==v.xh){
    						index = k;
    					}
    				})
    				$opt.relist.splice(index,1);
    			}else{
    				$opt.relist.push(json)
    			}
    			$(this).toggleClass("btn-light");
    			$(this).toggleClass("btn-primary");
    			$t.initDishesRemark();
    		})
    	},
		//返回筛选器对象,用于链式操作
    	hsOle: function() {
            return this.$element;      
        }, 
        initDishesRemark : function(){
        	var t=this;
    		var param=t.options;
    		var el=t.$element;
    		var dishesText = "";
    		$(param.relist).each(function(k,v){
    			if(k==0){
    				dishesText = v.mc
    			}else{
    				dishesText += ","+v.mc
    			}
    		})
    		el.find("#remarkDishes").val(dishesText)
        }
    }
})(jQuery);